{include file="pub/header" /}
	<div class="body"> 
		<div class="nav">
			添加公众号导航
		</div>
		<div class="tap">
			<span class="active">添加公众号导航</span>
		</div>
		<div class="from">
			<form action="" class="active" method="post" enctype="multipart/form-data">
				<div class="p">
					<label>
						<span class="span">公众号</span>
						<select name="wechat_id">
							<option value="0">请选择</option>
							{foreach name="wechat" item="value" key="k"}
								<option value="{$value.id}">{$value.wechat_name}</option>
							{/foreach}
						</select>
					</label>
				</div>
				<div class="p">
					<label>
						<span class="span">菜单名称</span>
						<input type="text" name="name" />
					</label> 
				</div>
				<div class="p" id="grade"></div>
				<div class="p" id="parent"></div>
				<div class="p" id="nav"></div>
				<div class="p" id="navinfo"></div>
				<div class="p">
					<label>
						<input type="submit" value="提交">
					</label>
				</div>

				<script>
				$("select[name='wechat_id']").change(function(){
					var val = $(this).val();
					if (val != 0) {
						var html = '<label><span class="span">导航等级</span> <select name="grade"><option value="0">请选择</option><option value="1">一级菜单</option><option value="2">二级菜单</option></select></label>';
						$("#grade").html(html);
						$("#nav").html('');
						$("#navinfo").html('');
						$("#parent").html('');
					}else{
						$("#grade").html('');
						$("#nav").html('');
						$("#navinfo").html('');
						$("#parent").html('');
					}
					
				});	
				$(document).on("change","select[name='grade']",function(){
					var val = $(this).val();
					if (val == 1) {
						var html1 = '<label> <span class="span">类型</span> <select name="type"><option value="0">请选择类型</option><option value="view" title="用户点击view类型按钮后，微信客户端将会打开开发者在按钮中填写的网页URL，可与网页授权获取用户基本信息接口结合，获得用户基本信息">跳转URL</option><option value="miniprogram" title="用户点击miniprogram类型按钮后，微信客户端将会打开开发者在按钮中填写的小程序，并跳转到指定URL">跳转小程序</option><option value="click" title="用户点击click类型按钮后，微信服务器会通过消息接口推送消息类型为event的结构给开发者（参考消息接口指南），并且带上按钮中开发者填写的key值，开发者可以通过自定义的key值与用户进行交互">点击推事件</option><option value="scancode_push" title="用户点击按钮后，微信客户端将调起扫一扫工具，完成扫码操作后显示扫描结果（如果是URL，将进入URL），且会将扫码的结果传给开发者，开发者可以下发消息">扫码推事件</option><option value="scancode_waitmsg" title="用户点击按钮后，微信客户端将调起扫一扫工具，完成扫码操作后，将扫码的结果传给开发者，同时收起扫一扫工具，然后弹出“消息接收中”提示框，随后可能会收到开发者下发的消息">扫码推事件且弹出“消息接收中”提示框</option><option value="pic_sysphoto" title="用户点击按钮后，微信客户端将调起系统相机，完成拍照操作后，会将拍摄的相片发送给开发者，并推送事件给开发者，同时收起系统相机，随后可能会收到开发者下发的消息">弹出系统拍照发图</option><option value="pic_photo_or_album" title="用户点击按钮后，微信客户端将弹出选择器供用户选择“拍照”或者“从手机相册选择”。用户选择后即走其他两种流程">弹出拍照或者相册发图</option><option value="pic_weixin" title="用户点击按钮后，微信客户端将调起微信相册，完成选择操作后，将选择的相片发送给开发者的服务器，并推送事件给开发者，同时收起相册，随后可能会收到开发者下发的消息">弹出微信相册发图器</option><option value="location_select" title="用户点击按钮后，微信客户端将调起地理位置选择工具，完成选择操作后，将选择的地理位置发送给开发者的服务器，同时收起位置选择工具，随后可能会收到开发者下发的消息">弹出地理位置选择器</option><option value="media_id" title="用户点击media_id类型按钮后，微信服务器会将开发者填写的永久素材id对应的素材下发给用户，永久素材类型可以是图片、音频、视频、图文消息。请注意：永久素材id必须是在“素材管理/新增永久素材”接口上传后获得的合法id">下发消息（除文本消息）</option><option value="view_limited" title="用户点击view_limited类型按钮后，微信客户端将打开开发者在按钮中填写的永久素材id对应的图文消息URL，永久素材类型只支持图文消息。请注意：永久素材id必须是在“素材管理/新增永久素材”接口上传后获得的合法id">跳转图文消息URL</option></select></label>';
						html2 = '<input type="text" name="parent_id" value="0" hidden />';
						$("#nav").html(html1);
						$("#parent").html(html2);
						$("#navinfo").html('');
					}else if (val == 2) {
						var html1 = '<label> <span class="span">类型</span> <select name="type"><option value="0">请选择类型</option><option value="view" title="用户点击view类型按钮后，微信客户端将会打开开发者在按钮中填写的网页URL，可与网页授权获取用户基本信息接口结合，获得用户基本信息">跳转URL</option><option value="miniprogram" title="用户点击miniprogram类型按钮后，微信客户端将会打开开发者在按钮中填写的小程序，并跳转到指定URL">跳转小程序</option><option value="click" title="用户点击click类型按钮后，微信服务器会通过消息接口推送消息类型为event的结构给开发者（参考消息接口指南），并且带上按钮中开发者填写的key值，开发者可以通过自定义的key值与用户进行交互">点击推事件</option><option value="scancode_push" title="用户点击按钮后，微信客户端将调起扫一扫工具，完成扫码操作后显示扫描结果（如果是URL，将进入URL），且会将扫码的结果传给开发者，开发者可以下发消息">扫码推事件</option><option value="scancode_waitmsg" title="用户点击按钮后，微信客户端将调起扫一扫工具，完成扫码操作后，将扫码的结果传给开发者，同时收起扫一扫工具，然后弹出“消息接收中”提示框，随后可能会收到开发者下发的消息">扫码推事件且弹出“消息接收中”提示框</option><option value="pic_sysphoto" title="用户点击按钮后，微信客户端将调起系统相机，完成拍照操作后，会将拍摄的相片发送给开发者，并推送事件给开发者，同时收起系统相机，随后可能会收到开发者下发的消息">弹出系统拍照发图</option><option value="pic_photo_or_album" title="用户点击按钮后，微信客户端将弹出选择器供用户选择“拍照”或者“从手机相册选择”。用户选择后即走其他两种流程">弹出拍照或者相册发图</option><option value="pic_weixin" title="用户点击按钮后，微信客户端将调起微信相册，完成选择操作后，将选择的相片发送给开发者的服务器，并推送事件给开发者，同时收起相册，随后可能会收到开发者下发的消息">弹出微信相册发图器</option><option value="location_select" title="用户点击按钮后，微信客户端将调起地理位置选择工具，完成选择操作后，将选择的地理位置发送给开发者的服务器，同时收起位置选择工具，随后可能会收到开发者下发的消息">弹出地理位置选择器</option><option value="media_id" title="用户点击media_id类型按钮后，微信服务器会将开发者填写的永久素材id对应的素材下发给用户，永久素材类型可以是图片、音频、视频、图文消息。请注意：永久素材id必须是在“素材管理/新增永久素材”接口上传后获得的合法id">下发消息（除文本消息）</option><option value="view_limited" title="用户点击view_limited类型按钮后，微信客户端将打开开发者在按钮中填写的永久素材id对应的图文消息URL，永久素材类型只支持图文消息。请注意：永久素材id必须是在“素材管理/新增永久素材”接口上传后获得的合法id">跳转图文消息URL</option></select></label>';
						
						var wechat_id = $("select[name='wechat_id']").val();
						
						$.post("",
						{
							wechat_id:wechat_id,
						},
						function(data,status){

							var html2 = '<label><span class="span">上级导航</span> <select name="parent_id"> <option value="0">请选择</option>';
							for(var key in data){
								html2 += '<option value="' + key +'">' + data[key] + '</option>';
							}
							html2 += '</select></label>';
							$("#nav").html(html1);
							$("#parent").html(html2);
							$("#navinfo").html('');
						});
					}else{
						$("#nav").html('');
						$("#parent").html('');
						$("#navinfo").html('');
					}
				});

				$(document).on("change","select[name='type']",function(){
					var val = $(this).val();
					if (val == 'view') {
						//跳转网页
						var html = '<label><span class="span">url</span> <input type="text" name="url" /></label>';
						// $("#navinfo").html(html);
					}else if(val == 'miniprogram'){
						//跳转小程序
						var html = '<label><span class="span">url</span> <input type="text" name="url" value="http://mp.weixin.qq.com" /></label> <label><span class="span">小程序appid</span> <input type="text" name="appid" /></label> <label><span class="span">小程序路径</span> <input type="text" name="pagepath" /></label>';
					}else if(val == 'click' || val == 'location_select'){
						var html = '<label><span class="span">菜单KEY值</span> <input type="text" name="key" /></label>';
					}else if (val == 'scancode_push' || val == 'scancode_waitmsg' || val == 'pic_sysphoto' || val == 'pic_photo_or_album' || val == 'pic_weixin') {
						var html = '<label><span class="span">菜单KEY值</span> <input type="text" name="key" /> <input type="text" name="sub_button[]" hidden /> </label>';
					}else if (val == 'media_id' || val == 'view_limited') {
						var html = '<label><span class="span">media_id</span> <input type="text" name="media_id" /></label>';
					}else{
						var html = '';
					}
					$("#navinfo").html(html);
				});

				</script>
				
			</form>
		</div>
	</div>
{include file="pub/footer" /}
